<template>
	<section>
        <el-row class="app-container">
            <el-row>
				<el-row>
					<el-col :span="20">
						<i class="el-icon-s-opportunity icon1"></i>
						<span style="color:#333; font-size:16px">流程:创建 - 工作签报 - 创建</span>
					</el-col>
					<el-col :span="4">
						<div class="rightButton">
							<el-button type="primary" size="small" @click="addSubmit" :loading="load.add">提交</el-button>
							<!-- <el-button type="primary" size="small">保存</el-button> -->
						</div>
					</el-col>
				</el-row>
			</el-row>

            <el-tabs v-model="activeName">
                <el-tab-pane label="流程表单" name="first">
                    <el-col :span="24" style="color: rgb(216,34,37)">
						<h3 align="center">工作签报</h3>
                        <el-form class="redItem" ref="addForm" :model="addForm" :rules="addFormRules" label-width="100px" size="mini">
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="标题:" prop="docTitle">
                                        <el-input v-model="addForm.docTitle"></el-input>
                                    </el-form-item>
                                </el-col>

                                <el-col :span="6" prop="dispatchDate">
                                    <el-form-item label="发文日期:">
                                        <el-date-picker
                                            type="date"
                                            v-model="addForm.dispatchDate"
                                            placeholder="选择日期"
                                            >
                                        </el-date-picker>
                                    </el-form-item>
                                </el-col>

                                <el-col :span="5">
                                    <el-form-item label="紧急程度:" prop="urgencyLevel">
                                        <el-select  v-model="addForm.urgencyLevel" placeholder="请选择">
												<el-option
												v-for="item in urgencyLevel"
												:key="item.optionName"
												:label="item.optionName"
												:value="item.optionName">
												</el-option>
										</el-select>
                                    </el-form-item>
                                </el-col>

                                 <el-col :span="5">
                                    <el-form-item label="字名:" prop="wordName">
											<el-select v-model="addForm.wordName" placeholder="请选择">
												<el-option
												v-for="item in docTopicOptions"
												:key="item.label"
												:label="item.label"
												:value="item.label">
												</el-option>
											</el-select>
										</el-form-item>
                                </el-col>

                            </el-row>

                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="编号:" prop="signNumber">
                                        <el-input v-model="addForm.signNumber"></el-input>
                                    </el-form-item>
                                </el-col>

                                <el-col :span="8">
                                    <el-form-item label="签报单位:" >
										<el-input readonly v-model="addForm.signDeptname"  @focus="openDeptSelect" suffix-icon="el-icon-search"></el-input>
                                    </el-form-item>
                                </el-col>

                                <el-col :span="8">
                                    <el-form-item label="签报人:">
										<el-input readonly v-model="addForm.signUsername"  @focus="openUserSelect" suffix-icon="el-icon-search"></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="签报标题:" prop="signTitle">
                                        <el-input  v-model="addForm.signTitle"></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="签报内容:" prop="signNav">
                                        <el-input
                                            type="textarea"
                                            :rows="4"
                                            placeholder="请输入内容"
                                            v-model="addForm.signNav"
                                            >
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="附件">
                                        <!--附件上传插件 -->
                                        <div style="margin-left:28px; padding-bottom:10px">
                                            <!--附件上传插件 -->
											<div style="margin-left:28px; padding-bottom:10px">
												<attachment-upload 
														:archiveId="uploadArchiveId" 
														:categoryId="uploadCategoryId"
														:branchId="userInfo.branchId"
														></attachment-upload>
											</div>
                                        </div>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            
                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="办公厅意见:">
                                        <el-input
                                            type="textarea"
                                            :rows="2"
                                            placeholder="请输入意见"
                                            v-model="addForm.officeOptions"
                                            disabled
                                            >
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="领导意见:">
                                        <el-input
                                            type="textarea"
                                            :rows="2"
                                            placeholder="请输入意见"
                                            v-model="addForm.leadOptions"
                                            disabled
                                            >
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </el-form>
                    </el-col>
                </el-tab-pane>

                <el-tab-pane label="流程图" name="second">
                </el-tab-pane>

                <el-tab-pane label="流程状态" name="third">
                </el-tab-pane>
            </el-tabs>

            
            <!--签报单位 ->部门选择组件-->
            <doc-archive-dept-select-components
                :showCheckbox="true"
                :branchId="userInfo.branchId"
                :defaultExpandAll="true"
                :isSingle="true"
                :checkedKeys="[addForm.signDeptid]"
                @select-dept-node="deptSelect"
                ref="openDeptSelect"
            ></doc-archive-dept-select-components>	
        
            <!-- 签报人选择组件 -->
            <doc-archive-user-select-components
                :isSingleUser="true"
                @get-user-data="getUserMsg"
                :selectUserids="[addForm.signUserid]"
                ref="openUserSelect"
            ></doc-archive-user-select-components>

        </el-row>
	</section>
</template>

<script>
    import util from '@/common/js/util';//全局公共库
    import dateUtil from '@/common/js/dateUtil';//全局公共库
    import {sn} from '@/common/js/sequence'; //id生成器
	import Sticky from '@/components/Sticky' // 粘性header组件
	
    import { mapGetters } from 'vuex'
    import { addWorkSign } from '@/api/mdp/arc/doc/docArchive'; 
    import DocArchiveDeptSelectComponents from '../docComponents/DocArchiveDeptSelectComponents';
    import DocArchiveUserSelectComponents from '../docComponents/DocArchiveUserSelectComponents';
    import {listDocWordName} from '@/api/mdp/arc/doc/docWordName'; 

    
	export default {
        inject:["reload"],
		computed: {
		    ...mapGetters([
		      'userInfo'
		    ])
		},
		data() {
			return {
				load:{ list: false, edit: false, del: false, add: false },//查询中...
				/**begin 自定义属性请在下面加 请加备注**/
                //默认选中
                activeName: "first",
                addForm: {
                    //文本标题
                    docTitle: '',
                    urgencyLevel:  '',
                    dispatchDate: new Date(),
                    number: "",
                    //签报用户Id
                    signUserid: "",
                    //签报用户名称
                    signUsername: "",
                    //签报人部门id
                    signDeptid: '',
                    //签报人部门名称
                    signDeptname: '',
                    //签报编号
                    signNumber: '',
                    //签报标题
                    signTitle: '',
                    //签报内容
                    signNav: '',
                    //办公厅意见
                    officeOptions: '',
                    //领导意见
                    leaderOptions: '',
                    //文档id
                    docId: '',
                    wordName: '',
                    branchId: '',
                },
                addFormRules: {
                    docTitle: [
                        { required: true, message: '标题不能为空', trigger: 'change' }
                    ],
                    urgencyLevel: [
						{ required: true, message: '紧急程度不能为空', trigger: 'change' }
                    ],
                    faWenDate: [
                        {required: true, message: '发文日期不能为空', trigger: 'change'}
                    ],
                    wordName: [
                        {required: true, message: '字名不能为空', trigger: 'change'}
                    ]

                },
                //紧急程度
                urgencyLevel: [],
                //上传组件必要参数
				uploadArchiveId: '',
				uploadCategoryId: '',
                //字名选择
                docTopicOptions: [],
                /**end 自定义属性请在上面加 请加备注**/
			}
		},//end data
		methods: { 
			/**begin 自定义函数请在下面加**/
            //新增提交DocArchive arc_doc_archive 父组件监听@submit="afterAddSubmit"
			addSubmit: function () {
                
				this.$refs.addForm.validate((valid) => {
					if (valid) {
						this.$confirm('确认提交吗？', '提示', {}).then(() => { 
							this.load.add=true
							let params = Object.assign({}, this.transformData(this.addForm)); 
							addWorkSign(params).then((res) => {
								this.load.add=false
								var tips=res.data.tips;
								if(tips.isOk){
                                    this.$refs['addForm'].resetFields();
                                    //刷新上传组件
                                    this.$emit('submit');//  @submit="afterAddSubmit"
                                    this.reload();
                                }
								this.$message({ message: tips.msg, type: tips.isOk?'success':'error' }); 
							}).catch( err  => this.load.add=false);
						});
					}
				});
            },

            
            transformData(data) {
                data.dispatchDate = util.formatDate(data.dispatchDate, "yyyy-MM-dd HH:mm:ss");
                data.branchId = this.userInfo.branchId;
                let form = {
                    docArchive: data
                }
				return form;
			},


            //获取公共参数: urgencyLevel:紧急程度 , secrecyLevel: 保密级别
			getCommonData: function() {
				let params = [
					{categoryId:'all',itemCode:'urgencyLevel'},
				]
				listOption(params).then((res) => {
                    this.urgencyLevel = res.data.data.urgencyLevel
                    //设置默认select数据
                    this.addForm.urgencyLevel = this.urgencyLevel.length > 0 ? this.urgencyLevel[0].optionName : '';  
                })
			},

            //获取签报人数据
            getUserMsg: function(data) {
                this.addForm.signUserid = data[0].userid;
                this.addForm.signUsername = data[0].username
            },

            //获取签报单位部门数据
            deptSelect: function(data) {
                this.addForm.signUserid = data[0].deptid;
                this.addForm.signDeptname =data[0].deptName;
            },

            openDeptSelect: function() {
                this.$refs.openDeptSelect.openDialog();
            },

            openUserSelect: function() {
                this.$refs.openUserSelect.openDialog();
            },

            //获取正文数据
            getArchiveData: function() {
                
            },

            //设置表单默认参数
            setFormDefaultParam() {
                this.addForm.signUserid = this.userInfo.userid;
                this.addForm.signUsername = this.userInfo.username;
                this.addForm.signDeptid = this.userInfo.deptid;
                this.addForm.signDeptname = this.userInfo.deptName;
            },


            //获取字名
			getWordName() {
				let params = {
					branchId: this.userInfo.branchId
				}
				listDocWordName(params).then((res) => {
					var tips=res.data.tips;
					if(tips.isOk){ 
						res.data.data.forEach(p => {
							let param = {
								label: p.wordName
							}
							this.docTopicOptions.push(param);
						})
					}else{
						this.$message({ message: tips.msg, type: 'error' });
					} 
				}).catch();
			},

			/**end 自定义函数请在上面加**/
			
		},//end methods
		components: {  
            'doc-archive-dept-select-components': DocArchiveDeptSelectComponents,
            'doc-archive-user-select-components': DocArchiveUserSelectComponents,
		},
		mounted() { 
			this.$nextTick(() => {
                //获取公共数据
                this.getCommonData();
                this.getWordName();
            });
            this.setFormDefaultParam();
            //生成docId
			this.addForm.docId = sn();
            this.uploadArchiveId = this.addForm.docId;
			//生成docIdCategory
            this.uploadCategoryId = 'docArchive_upload';
		}
	}

</script>


<style >
.icon1 {
	font-size:24px;
	color: #409eff;
}

.rightButton {
	float: right;
}

.redItem .el-form-item__label {
	color: rgb(216,34,37);
	font-weight: normal;
}

.redItem .el-input {
	border: 1px red solid;
}

.redItem .el-textarea {
	border: 1px red solid;
}

</style>